<template>

	<div>
<div id="resetBankNumber">

    <div class="resetBankNumber_infor">
        <ul>
            <li><p>新密码</p><p> <input type="password" placeholder="请输入您的新密码" id="newPwd"></p></li>
            <li><p>手机号</p> <p><input type="text" placeholder="请输入您的手机号码" id="phoneNum"></p></li>
            <li style="border-bottom: 0"><p style="margin-left: 2rem">验证码</p><p><input type="text" style="margin-left: 5rem;" placeholder="请输入验证码" id="resetBankNumber_yanzhengma"></p> <input type="button" style="position: relative;left: -1rem" id="btn" value="免费获取验证码" onclick="getLoginNumber()"/></li>
        </ul>
    </div>

    <div class="resetmimaBtn" id="confirmButton">
        <button onclick="resetMessage()">确定</button>
    </div>

    <div class="tishiWrap">
        <p></p>
    </div>
</div>
	</div>
</template>

<script>
	export default {

     name:'seven',

     data() {
        return {
        	message:111
        }
       },
     methods: {
       click() {}
     },
//   components: {
//     AppHeader
//   }
	}
</script>

<style lang="scss" scoped>
 .tishiWrap {
            width: 60%;
            background:rgba(0,0,0,0.4);
            display: none;
            height: 3rem;
            line-height: 3rem;
            border: 1px solid #cccccc;
            color: white;
            text-align: center;
            border-radius: 3rem;
            margin: auto;
            margin-top: 1rem;
        }
#resetBankNumber{
  width: 100%;
  margin: auto;
  .resetBankNumber_infor{
    width: 100%;
    margin: auto;
    background:white ;
    //padding: 1rem 0 1rem 0;
    //margin-top: 1rem;
    ul{
      width: 100%;
      margin: auto;
      li{
        width: 90%;
        height: 4rem;
        line-height: 4rem;
        padding: 1rem 0 1rem 0rem;
        display: flex;
        justify-content: start;
        margin: auto;
        border-bottom: 1px solid #ccc;
        //border: 1px solid;
        p {
          //font-size: 2rem;
          font-size: 1.6rem;
          font-family: PingFangSC-Medium;
          //font-weight: 700;
        }
        p:nth-child(1) {
          width: 20%;
          height: 4rem;
          line-height: 4rem;
          text-align: left;
        }
        p:nth-child(2) {
          width: 50%;
          height: 4rem;
          line-height: 4rem;
          font-size: 1.6rem;
          //border-right: 1px solid;
          input {
            width: 100%;
            /*padding-left: 5%;*/
            height: 3rem;
            line-height: 3rem;
            outline: none;
            border: 0;
            position: relative;
            right: 4rem;
            //font-size: 2rem;
          }

        }
        #btn{
          width: 10rem;
          background: white;
          border: 0;
          color: #32D69C;
          outline: none;
          position: relative;
          right: 3rem;
          font-size: 1.6rem;
          //margin-left: 4rem;
        }
      }
    }
  }
  .resetmimaBtn{
    width: 100%;
    margin-top: 7rem;
    text-align: center;
    button{
      width: 90%;
      height: 4rem;
      line-height: 4rem;
      background: #32D69C;
      text-align: center;
      color: white;
      border: 0;
      outline: none;
      border-radius: 2rem;
      font-size: 1.6rem;
    }
  }
}
.code2007{
  width: 100%;
  //border: 1px solid;
  position: absolute;
  bottom: 24rem;
  margin: auto;
  display: none;
  .code200702{
    width: 70%;
    height:12rem;
    border: 1px solid #CCCCCC;
    border-radius: 1.6rem;
    background: #f3f3f3;
    position: relative;
    margin: auto;
    p{
      font-size: 2rem;
      height: 3rem;
      line-height: 3rem;
      text-align: center;
      margin-top: 1rem;
    }
    ul{
      list-style: none;
      li{
        text-align: center;
        border-top: 1px solid ;
        font-size: 2rem;
        width: 100%;
        height: 5rem;
        line-height: 5rem;
        position: absolute;
        left: 0;
        bottom: 0;
      }
    }

  }
}
</style>
